<template>
  <a-form :form="form" @submit="handleSubmit">
    <a-form-item>
      <a-input
        v-decorator="[
          'phone',
          { rules: [{ required: true, message: '请输入手机号' }] },
        ]"
        placeholder="请输入手机号"
      >
      </a-input>
    </a-form-item>
    <a-form-item>
      <a-input
        v-decorator="[
          'password',
          { rules: [{ required: true, message: '请输入密码' }] },
        ]"
        type="password"
        placeholder="请输入密码"
      >
      </a-input>
    </a-form-item>
    <a-form-item>
      <a-button type="primary" html-type="submit">
        登录
      </a-button>
    </a-form-item>
  </a-form>
</template>

<script>
import {login} from "@/api";
function hasErrors(fieldsError) {
  return Object.keys(fieldsError).some(field => fieldsError[field]);
}
export default {
  data() {
    const form = this.$form.createForm(this, { name: 'horizontal_login' });
    return {
      hasErrors,
      form
    };
  },
  methods: {
    handleSubmit(e) {
      e.preventDefault();
      this.form.validateFields((err, values) => {
        if (err) {
          return;
        }
        // 发接口请求
        login(values).then(res => {
          console.log(res);
          window.localStorage.setItem('token',res.data.token);
          this.$router.push('/index');
        })
      });
    },
  },
};
</script>